<div class = "main-view"><!--最外层div-->
    <div class="left-margin top-margin"><strong class="am-text-primary am-text-lg">系统菜单</strong></div>
    <form class="am-form-inline left-margin top-margin" role="form">
        <div class="am-form-group">
            <label>菜单名</label> <input type="text" class="am-form-field" ng-model="desc">
        </div>

        <button type="submit" class="am-btn am-btn-primary" ng-click="search()">搜索</button>
    </form>
    <br>
    <div class="am-btn-group am-btn-group-xs left-margin top-margin">
        <button type="button" class="am-btn am-btn-default" data-am-modal="{target: '#doc-modal-add', width: 800, height: 600}"><span class="am-icon-plus"></span> 新增</button>
        <button type="button" class="am-btn am-btn-default" ng-click="delete()"><span class="am-icon-trash-o"></span> 删除</button>
    </div>
    <div id = "pagination" class = "pagination"></div>
    <div class="pagination-table left-margin" id="tab_menu" style = "margin-top: 0px;">
        <form class="am-form">
            <table class="am-table-striped am-table-hover table-main">
                <thead>
                <tr>
                    <th class="table-check"><input type="checkbox" ng-click="allSelected()"></th>
                    <th class="table-id">菜单ID</th>
                    <th class="table-title">菜单类别</th>
                    <th class="table-title">菜单名</th>
                    <th class="table-id">父菜单ID</th>
                    <th class="table-id">权限类别ID</th>
                    <th class="table-title">菜单顺序</th>
                    <th class="table-title">页面路径</th>
                    <th class="table-title">菜单图标</th>
                    <th class="table-title">菜单样式</th>
                    <th class="table-title">是否有效</th>
                    <th class="table-title">备注</th>
                    <th class="table-title">操作</th>
                </tr>
                </thead>
                <tbody>
                <tr ng-repeat="menu in menuList" id = "{{menu.sys_menuID}}">
                    <td class="table-check"><input type="checkbox" class = "item-check"></td>
                    <td>{{menu.sys_menuID}}</td>
                    <td>{{menu.menuType}}</td>
                    <td>{{menu.menuName}}</td>
                    <td>{{menu.parentID}}</td>
                    <td>{{menu.permissionsCategoryID}}</td>
                    <td>{{menu.menuOrder}}</td>
                    <td>{{menu.pagePath}}</td>
                    <td>{{menu.imagePath}}</td>
                    <td>{{menu.menuClass}}</td>
                    <td>{{menu.isValid ? "是":"否"}}</td>
                    <td>{{menu.remark}}</td>
                    <td>
                        <button class="am-btn am-btn-default am-btn-xs am-text-secondary" data-am-modal="{target: '#doc-modal-{{$index}}', width: 800, height: 600}"><span class="am-icon-pencil-square-o"></span> 编辑</button>
                        <!--编辑框 -->
                        <div class="am-modal am-modal-no-btn" tabindex="-1" id="doc-modal-{{$index}}">
                            <div class="am-modal-dialog">
                                <div class="am-modal-hd border-bottom" style = "text-align: left;">菜单编辑
                                    <a href="javascript: void(0)" class="am-close am-close-spin" data-am-modal-close>&times;</a>
                                </div>
                                <div class="am-modal-bd body-area text-left" style="margin-left: 50px">
                                    <form>
                                        <div><label>菜单类别</label><input type="text" class = "modal-input" style = "width: 200px;display: inline-block;" ng-model="menu.menuType"></div>
                                        <div><label>菜单名</label><input type="text" class = "modal-input" style = "width: 200px;display: inline-block;" ng-model="menu.menuName"></div>
                                        <div><label>父菜单ID</label><input type="text" class = "modal-input" style = "width: 200px;display: inline-block;" ng-model="menu.parentID"></div>
                                        <div><label>权限类别ID</label><input type="text" class = "modal-input" style = "width: 200px;display: inline-block;" ng-model="menu.permissionsCategoryID"></div>
                                        <div><label>菜单顺序</label><input type="text" class = "modal-input" style = "width: 200px;display: inline-block;" ng-model="menu.menuOrder"></div>
                                        <div><label>页面路径</label><input type="text" class = "modal-input" style = "width: 200px;display: inline-block;" ng-model="menu.pagePath"></div>
                                        <div><label>菜单图标</label><input type="text" class = "modal-input" style = "width: 200px;display: inline-block;" ng-model="menu.imagePath"></div>
                                        <div><label>菜单样式</label><input type="text" class = "modal-input" style = "width: 200px;display: inline-block;" ng-model="menu.menuClass"></div>
                                        <div><label>是否有效</label>
                                            <select style = "width: 60px;height: 38px;margin-left: 0px;display: inline-block; " ng-model="menu.isValid" required>
                                                <option value=1>是</option>
                                                <option value=0>否</option>
                                            </select>
                                        </div><br>
                                        <div><label>备注</label><br>
                                        <textarea  style="width:690px;height:150px;display: inline-block;" ng-model="menu.remark"></textarea></div>
                                    </form>
                                </div>
                                <div class = "button-area border-top">
                                    <button type="button" class="am-btn am-btn-success right-margin top-margin" ng-show="true" ng-click="update(menu,$index)">保存</button>
                                </div>
                            </div>
                        </div>


                    </td>
                </tr>
                </tbody>
            </table>
        </form>
    </div>

    <!--<div class = "left-margin">共<span id = 'page_number'>{{pageNumber}}</span>页 <span>{{count}}条数据</span></div>-->
    <!--新增框 -->
    <div class="am-modal am-modal-no-btn" tabindex="-1" id="doc-modal-add">
        <div class="am-modal-dialog">
            <div class="am-modal-hd border-bottom" style = "text-align: left;">新增菜单
                <a href="javascript: void(0)" class="am-close am-close-spin" data-am-modal-close>&times;</a>
            </div>
            <div class="am-modal-bd body-area text-left" style="margin-left: 50px">
                <form>
                    <div><label>菜单类别</label><input type="text" class = "modal-input" ng-model="addData.menuType"></div>
                    <div><label>菜单名</label><input type="text" class = "modal-input" ng-model="addData.menuName"></div>
                    <div><label>父菜单ID</label><input type="text" class = "modal-input" ng-model="addData.parentID"></div>
                    <div><label>权限类别ID</label><input type="text" class = "modal-input" ng-model="addData.permissionsCategoryID"></div>
                    <div><label>菜单顺序</label><input type="text" class = "modal-input" ng-model="addData.menuOrder"></div>
                    <div><label>页面路径</label><input type="text" class = "modal-input" ng-model="addData.pagePath"></div>
                    <div><label>菜单图标</label><input type="text" class = "modal-input" ng-model="addData.imagePath"></div>
                    <div><label>菜单样式</label><input type="text" class = "modal-input" ng-model="addData.menuClass"></div>
                    <!--<div><label>是否有效</label>-->
                        <!--<select style = "width: 60px;height: 38px;margin-left: 0px;display: inline-block; " ng-model="menu.isValid" required>-->
                            <!--<option value=1>是</option>-->
                            <!--<option value=0>否</option>-->
                        <!--</select>-->
                    <!--</div><br>-->
                    <div><label>备注</label><br>
                    <textarea style="width:690px;height:150px;display: inline-block;"  ng-model="addData.remark"></textarea></div>
                </form>
            </div>
            <div class = "button-area border-top">
                <button type="button" class="am-btn am-btn-success right-margin top-margin" ng-show="true" ng-click="add(addData)">保存</button>
            </div>
        </div>
    </div>
</div>